import { Card, Descriptions, Button, Spin, message } from "antd";
import { useAppSelector } from "@/store/hooks";
import { DownloadOutlined } from "@ant-design/icons";

export default function MTable() {
  // 从Redux中获取数据
  const { table } = useAppSelector((state) => state.userExport);
  const loadingStatus = table.status === "loading";
  const tableData = table.data?.data || {  path: ''  };

  // 处理文件下载功能
  const handleDownload = () => {
    const path = (table.data?.data as { path: string })?.path ;
    if (path) {
      const link = document.createElement('a');
      link.href = path;
      link.download = path.split('/').pop() || 'download';
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    } else {
      message.error('无有效下载链接');
    }
  };

  return (
    <Card bordered={false}>
      <Spin spinning={loadingStatus}>
        {/* 数据详情展示 */}
        <Descriptions bordered column={2} size="small" className="mb-4">
          <Descriptions.Item label="数据路径">
            <span className="text-blue-500">{tableData.path}</span>
          </Descriptions.Item>
          <Descriptions.Item label="操作">
            <Button type="link" icon={<DownloadOutlined />} onClick={handleDownload}>
              下载文件
            </Button>
          </Descriptions.Item>
        </Descriptions>
      </Spin>
    </Card>
  );
}
